// components/form/form.js
import moment from 'moment';
import { calDays, formatDay } from '../../utils/myMoment'
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    show: Boolean,
    title: String,
    context: String,
    course: String,
    end: {
      type: Number,
      value: new Date().getTime()
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    days: '今天',
    courseShow: false,
    endShow: false,
    minDate: moment().subtract(1, 'years').format("x"),
    formatter(type, value) {
      if (type === 'year') {
        return `${value} 年`;
      } else if (type === 'month') {
        return `${value} 月`;
      }
      return `${value} 日`;
    },
    courseList: [
      '微信公众平台开发',
      '移动应用项目开发综合',
      '移动网络应用开发',
      '人工智能基础',
      '软件测试与代码安全'
    ]
  },

  observers: {
    'end': function (end) {
      this.setData({ days: calDays(end) })
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    /**
     * 传递关闭事件
     */
    close() {
      this.triggerEvent('close')
    },

    /**
     * 传递提交事件
     */
    formSubmit() {
      const { title = '', context = '', course = '', end = new Date().valueOf() } = this.properties
      const form = { title, context, course, end }
      this.triggerEvent('submit', { form })
    },

    /**
     * 输入更新
     */
    inputEnd(event) {
      this.data[event.currentTarget.id] = event.detail.value
    },

    /**
     * 显示/关闭 科目选择器
     */
    coursePopup() {
      this.setData({ courseShow: !this.data.courseShow })
    },

    /**
     * 确认 科目选择器
     */
    courseConfirm(event) {
      this.setData({ course: event.detail.value })
      this.coursePopup()
    },


    /**
     * 显示/关闭 日期选择器
     */
    endPopup() {
      this.setData({ endShow: !this.data.endShow })
    },

    /**
     *  确认 日期选择器
     */
    endConfirm(event) {
      const time = event.detail
      this.properties.end = time
      // 显示 x 天前/后 , YYYY/MM/DD
      this.setData({ days: calDays(time) + ' , ' + formatDay(time) })
      this.endPopup()
    },
  }
})
